<template>
    <XClickDialog ref='dialogRef' title='设置策略' width='400px' @close='close' :confirm='confirm'>
        <el-button type='primary' size='mini'>设置策略</el-button>
        <template #content>
            <XLazyloadSelect class='w-100' type='text' clearable  valueField='strategyId' labelField='strategyName' :loadFunc='queryStrategyNameApi' v-model='strategyId' />
        </template>
    </XClickDialog>
</template>

<script lang='ts' setup>
    import { ref } from 'vue'
    import { queryStrategyNameApi } from '../../api/chargeStrategy'
    import { setStrategyApi } from '../../api/device'
    import { ElMessage } from 'element-plus'
    
    const props = defineProps<{
        deviceIds : number[]
    }>()

    const emit = defineEmits<{
        (e : 'success') : void
    }>()


    const dialogRef = ref()
    const strategyId = ref()

    async function confirm() {
        if(props.deviceIds.length == 0 || !strategyId.value) return

        const res = await setStrategyApi(strategyId.value, props.deviceIds)
        if(res === true) {
            dialogRef.value.close()
            ElMessage.success('设置成功')
            emit('success')
        }else {
            ElMessage.error!('设置失败')
        }
    }

    function close() {
        strategyId.value = ''
    }
</script>
